<template>
    <Form ref="formItem" :model="formItem" :label-width="80" :rules="ruleValidate" style="position: relative;">
        <FormItem label="届" prop="arrives_id">
            <Select v-model="formItem.arrives_id">
                <Option v-for="item in arrivesList" :value="item.id" :key="item.id">{{ item.name.zh?item.name.zh:item.name.mn }}</Option>
            </Select>
        </FormItem>
        <FormItem label="班级类型" prop="class_kind_dict">
            <Select v-model="formItem.class_kind_dict">
                <Option v-for="item in DictionaryClassTypeList.class_kind_dict" :value="item.dictionary_id" :key="item.dictionary_id">{{ item.dictionary_name.zh?item.dictionary_name.zh:item.dictionary_name.mn }}</Option>
            </Select>
        </FormItem>
        <FormItem label="班级性质" prop="class_nature">
            <Select v-model="formItem.class_nature">
                <Option v-for="item in DictionaryClassTypeList.class_nature" :value="item.dictionary_id" :key="item.dictionary_id">{{ item.dictionary_name.zh?item.dictionary_name.zh:item.dictionary_name.mn }}</Option>
            </Select>
        </FormItem>
        <FormItem label="班级教室">
            <Cascader v-model="val" :data="RoomList" @on-change="classroomId" :load-data="loadData"></Cascader>
        </FormItem>
        <FormItem label="是否毕业" prop="graduated_flag">
            <Select v-model="formItem.graduated_flag">
                <Option :value="1" :key="1">是</Option>
                <Option :value="0" :key="0">否</Option>
            </Select>
        </FormItem>

        <FormItem label="班级状态" prop="class_status">
            <Select v-model="formItem.class_status">
                <Option :value="1" :key="1">启用</Option>
                <Option :value="0" :key="0">禁用</Option>
            </Select>
        </FormItem>

        <FormItem label="中文名称" prop="eclass_name.zh">
            <Input v-model="formItem.eclass_name.zh" placeholder="班级中文名称"></Input>
        </FormItem>

        <FormItem label="班级口号" >
            <Input v-model="formItem.eclass_slogan.zh" type="textarea" :autosize="{minRows: 2,maxRows: 5}" placeholder="班级口号"></Input>
        </FormItem>

        <FormItem label="教师寄语" >
            <Input v-model="formItem.teacher_comment.zh" type="textarea" :autosize="{minRows: 2,maxRows: 5}" placeholder="教师寄语"></Input>
        </FormItem>

        <FormItem label="班级简介">
            <orh-editor v-model="formItem.introduction.zh" module="BasicModule"/>
        </FormItem>
        <FormItem label="班级LOGO">
            <orh-up-img @uploadData='upload' :currentImg="pic" v-if="isShow"></orh-up-img>
        </FormItem>
        <FormItem label="班级风采">
            <orh-up-img @uploadData='uploads' :currentImg="pics" v-if="isShow"></orh-up-img>
        </FormItem>

        <FormItem>
            <Button type="primary" @click="submit('formItem')">保存</Button>
        </FormItem>
        <div style="clear:both"></div>
        <Spin size="large" fix v-if="spinShow"></Spin>
    </Form>
</template>

<script>
export default {
    props: {
        infoId: {
            type: [Boolean,Number],
            default: false
        }
    },
	components: {},
    data () {
        return {
            isShow:false,
            pic:'',
            pics:'',
            infoUrl:'api/eclass/v1/eclass/lists/',//请求单条数据
            saveUrl:null,
            saveType:null,
            spinShow:false,
            
            val:[],//房间的默认选中
            DictionaryClassTypeList:[],//班级类型h和班级性质
            RoomList:[],//房间
            infoOld:[],//请求的数据
            formItem: {
                arrives_id:1,
                teacher_id:null,
                eclass_code:null,
                class_kind_dict:null,
                graduated_flag:null,
                eclass_number :null,
                eclass_name:{
                    zh:null,
                    en:null,
                    mn:null,
                },
                introduction:{
                    zh:null,
                    en:null,
                    mn:null,
                },
                eclass_slogan:{
                    zh:null,
                    en:null,
                    mn:null,
                },
                teacher_comment:{
                    zh:null,
                    en:null,
                    mn:null,
                },
                file:[],
                eclassfile:[],
                class_status:1,//0禁用1启用
                buildings_id:null,//楼宇id
                unit_id:null,//单元id
                floor_id:null,//楼层id
                classroom:null,//班级房间id
                class_nature:null,//班级性质
                eclass_size:0,
            },
            arrivesUrl: 'api/base/v1/get/all/arrives',
            arrivesList: [],
            ruleValidate: {
                'eclass_name.zh': [
                    { required: true, message: '名称不得为空', trigger: 'blur' }
                ],
                class_kind_dict: [
                    {  type:'number', required: true, message: '班级类型不得为空', trigger: 'blur' }
                ],
                class_nature: [
                    { type:'number', required: true, message: '班级性质不得为空', trigger: 'blur' }
                ],
                graduated_flag: [
                    { type:'number',required: true, message: '是否毕业班必须选', trigger: 'change' }
                ],
                arrives_id: [
                    { type:'number',required: true, message: '届必须选', trigger: 'change' }
                ],
            },
        }
    },
    methods: {
        /************************************************************
         * 
         * 保存数据请求
         * 
         ************************************************************/ 
        submit (name) {
            this.$refs[name].validate((valid) => {
                if (valid) {
                    this.spinShow=true
                    this.saveType(this.saveUrl,this.formItem).then(val=>{
                        this.$emit('showParent',false)
                        this.$emit('backList',true)
                        this.$Message.success(val.message);
                        this.spinShow=false
                    }).catch(err => {
                        if (err.code && err.code == 422) {
                            this.$Message.error(err.message);
                        }
                        this.spinShow=false
                    })
                } else {
                    this.$Message.error('验证失败');
                }
            })
        },

        /************************************************************
         * 
         * 上传图片
         * 
         ************************************************************/
        upload(val) {
            this.formItem.file.push(val.id);
        },

        uploads(val) {
            this.formItem.eclassfile.push(val.id);
        },

        /************************************************************
         * 
         * 数据字典获取班级类型
         * 
         ************************************************************/ 
        dictionaryClassType(){
            this.spinShow=true
            this.$http.get('api/dictionary/v1/dictionary/pidquerys?class_kind_dict&class_nature').then(val=>{
                this.DictionaryClassTypeList=val.data
                this.spinShow=false
            }).catch(err => {
                if (err.code && err.code == 422) {
                    this.$Message.error(err.message);
                }
                this.spinShow=false
            })
        },
        
        
        /************************************************************
         * 
         * 单条数据请求
         * 
         ************************************************************/ 
        infoData(){
            this.spinShow=true
            this.$http.get(this.infoUrl+this.infoId).then(val=>{
                this.infoOld = JSON.parse(JSON.stringify(val.data))
                this.formItem.graduated_flag = parseInt(this.infoOld.graduated_flag)//用于默认选的  是否毕业
                this.formItem.arrives_id = parseInt(this.infoOld.arrives_id)//用于默认选的 班级id
                this.formItem.class_status = parseInt(this.infoOld.class_status)//用于默认选的 班级状态
                this.formItem.teacher_id = this.infoOld.teacher_id//用于默认选的 班主任id
                this.formItem.eclass_code = this.infoOld.eclass_code//用于默认选的 班级编号
                this.formItem.class_kind_dict = parseInt(this.infoOld.class_kind_dict)//用于默认选的 班级类型
                this.formItem.class_nature = parseInt(this.infoOld.class_nature)//用于默认选的 班级性质
                this.formItem.buildings_id = this.infoOld.buildings_id==0 ? '' : parseInt(this.infoOld.buildings_id)//用于默认选的 班级房间
                this.formItem.unit_id = this.infoOld.unit_id==0 ? '' : parseInt(this.infoOld.unit_id)//用于默认选的 班级房间
                this.formItem.floor_id = this.infoOld.floor_id==0 ? '' : parseInt(this.infoOld.floor_id)//用于默认选的 班级房间
                this.formItem.classroom = this.infoOld.classroom==0 ? '' : parseInt(this.infoOld.classroom)//用于默认选的 班级房间
                this.formItem.eclass_number = this.infoOld.eclass_number//用于默认选的 班级号
                // this.formItem.eclass_size = this.infoOld.eclass_size_lang//班级人数
                this.formItem.eclass_name.zh = this.infoOld.eclass_name.zh?this.infoOld.eclass_name.zh:this.infoOld.eclass_name.mn//名称
                this.formItem.introduction.zh = this.infoOld.introduction.zh?this.infoOld.introduction.zh:this.infoOld.introduction.mn//班级简介
                this.formItem.eclass_slogan.zh = this.infoOld.eclass_slogan.zh?this.infoOld.eclass_slogan.zh:this.infoOld.eclass_slogan.mn//班级口号
                this.formItem.teacher_comment.zh = this.infoOld.teacher_comment.zh?this.infoOld.teacher_comment.zh:this.infoOld.teacher_comment.mn//教师寄语
                this.pic = this.infoOld.ioc_path
                this.pics = this.infoOld.eclass_pic 	
                this.isShow = true
                this.val=[this.formItem.buildings_id,this.formItem.unit_id,this.formItem.floor_id,this.formItem.classroom]
                this.spinShow=false
            }).catch(err => {
                if (err.code && err.code == 422) {
                    this.$Message.error(err.message);
                }
                this.spinShow=false
            })
        },
        
        /************************************************************
         * 
         * 加载教学楼宇
         * 
         ************************************************************/ 
        load() {
            this.spinShow=true
            this.$http.get('api/buildings/v1/buildings/buildings_dormitory?buildings_type=teaching_building').then((response) => {
                this.RoomList=this.process(response.data)
                this.spinShow=false
            }).catch(err => {
                if (err.code && err.code == 422) {
                    this.$Message.error(err.message);
                }
                this.spinShow=false
            })
        },
        /************************************************************
         * 
         * 处理数据
         * 
         ************************************************************/ 
        process(data) {
            let arr = []
            data.forEach(item => {
                arr.push({
                    value : item.buildings_id,
                    label : item.buildings_name.zh?item.buildings_name.zh:item.buildings_name.mn,
                    children : [],
                    loading: false,
                    type:1//表示点击的一级楼宇
                })
            })
            return arr
        },

        /************************************************************
         * 
         * 异步加载单元
         * 
         ************************************************************/
        loadData(item, callback) {
            item.loading = true;
            // 表示点击的一级楼宇
            if(item.type===1){
                this.$http.get('api/buildings/v1/unit/getunitlists/'+item.value).then((response) => {
                    setTimeout(() => {
                        if(response.data.length===0){
                            item.children.push({
                                value : '',
                                label : '',
                                type:2//表示二级单元
                            })
                        }else{
                            item.children=[]
                            response.data.forEach(item1 => {
                                item.children.push({
                                    value : item1.unit_id,
                                    label : item1.unit_name.zh?item1.unit_name.zh:item1.unit_name.mn,
                                    children : [],
                                    loading: false,
                                    type:2//表示二级单元
                                })
                            })
                        }
                        item.loading = false;
                        callback();
                    }, 1000);
                }).catch(err => {
                    if (err.code && err.code == 422) {
                        this.$Message.error(err.message);
                    }
                    this.spinShow=false
                })
            }
            // 表示点击的二级单元
            if(item.type===2){
                this.$http.get('api/buildings/v1/floor/getfloorlists/'+item.value).then((response) => {
                    setTimeout(() => {
                        if(response.data.length===0){
                            item.children.push({
                                value : '',
                                label : '',
                                type:3//表示三级楼层
                            })
                        }else{
                            item.children=[]
                            response.data.forEach(item1 => {
                                item.children.push({
                                    value : item1.floor_id,
                                    label : item1.floor_name.zh?item1.floor_name.zh:item1.floor_name.mn,
                                    children : [],
                                    loading: false,
                                    type:3//表示三级楼层
                                })
                            })
                        }
                        item.loading = false;
                        callback();
                    }, 1000);
                }).catch(err => {
                    if (err.code && err.code == 422) {
                        this.$Message.error(err.message);
                    }
                })
            }
            // 表示点击的三级楼层
            if(item.type===3){
                this.$http.get('api/buildings/v1/room/getroomlists/'+item.value).then((response) => {
                    setTimeout(() => {
                        if(response.data.length===0){
                            item.children.push({
                                value : '',
                                label : '',
                            })
                        }else{
                            item.children=[]
                            response.data.forEach(item1 => {
                                item.children.push({
                                    value : item1.room_id,
                                    label : item1.name.zh?item1.name.zh:item1.name.mn,
                                })
                            })
                        }
                        item.loading = false;
                        callback();
                    }, 1000);
                    this.spinShow=false
                }).catch(err => {
                    if (err.code && err.code == 422) {
                        this.$Message.error(err.message);
                    }
                })
            }
        },
        
        /************************************************************
         * 
         * 给房间id赋值
         * 
         ************************************************************/
        classroomId(value,selectedData){
            this.formItem.buildings_id=value[0]==0 ? '' : value[0]
            this.formItem.unit_id=value[1]==0 ? '' : value[1]
            this.formItem.floor_id=value[2]==0 ? '' : value[2]
            this.formItem.classroom=value[3]==0 ? '' : value[3]
        },
        /************************************************************
         * 
         * 届信息获取
         * 
         ************************************************************/
        arrivesData(){
            this.spinShow=true
            this.$http.get(this.arrivesUrl).then(val=>{       
                this.arrivesList = val.data
                this.spinShow=false
            }).catch(err => {
                if (err.code && err.code == 422) {
                    this.$Message.error(err.message);
                }
                this.spinShow=false
            })
        },
    },
    mounted(){
        this.load()
        this.dictionaryClassType()
        this.arrivesData()
        if(this.infoId==false){
            // add
            this.saveUrl='api/eclass/v1/eclass/create'
            this.saveType=this.$http.post
            this.isShow = true;
        }else{
            // edit
            this.infoData();
            this.saveUrl=`api/eclass/v1/eclass/update/${this.infoId}`
            this.saveType=this.$http.put
        }
    },
}
</script>
